import { createRouter, createWebHashHistory } from 'vue-router'

const routes = [
    {
        path: '/',
        meta: { requiresAuth: true },
        component: () => import('../view/home/index.vue'),
    },
    {
        path: '/try',
        name: 'Try',
        component: () => import('../view/try/index.vue')
    },
    {
        path: '/home',
        name: 'home',
        meta: { requiresAuth: true },
        component: () => import('../view/home/index.vue'),
        redirect: '/',
        children: [
            {
                path: '',
                component: () => import('../view/keepAlive/index.vue')
            },
            {
                path: 'user',
                component: () => import('../view/user/list.vue')
            },
            {
                path: 'company',
                component: () => import('../view/company/list.vue')
            },
            {
                path: 'tsType',
                name: 'TsType',
                component: () => import('../view/tsOfType/index.vue')
            },
            {
                path: 'note',
                name: 'Note',
                component: () => import('../view/note/list.vue')
            },
            {
                path: 'setting',
                name: 'Setting',
                component: () => import('../view/setting/index.vue')
            },
            {
                path: 'editor',
                name: 'Editor',
                component: () => import('../view/editor/index.vue'),
                children: [
                    {
                        path: 'wangEditor5',
                        name: 'WangEditor5',
                        component: () => import('../view/editor/wangEditor5.vue'),
                    }
                ]
            },
            {
                path: 'createIcon',
                name: 'CreateIcon',
                component: () => import('../view/createIcon/index.vue')
            },
            {
                path: 'fullSrceen',
                name: 'FullSrceen',
                component: () => import('../view/fullScreen/index.vue')
            },
            {
                path: 'refDom',
                name: 'RefDom',
                component: () => import('../view/refDom/index.vue')
            },
            {
                path: 'sameHeight',
                name: 'SameHeight',
                component: () => import('../view/sameHeight/index.vue')
            },
            {
                path: 'grid',
                name: 'Grid',
                component: () => import('../view/grid/index.vue')
            },
            {
                path: 'meteorShower',
                name: 'MeteorShower',
                component: () => import('../view/canvas/meteorShower.vue')
            },
            {
                path: 'cssLearn',
                name: 'CssLearn',
                component: () => import('../view/cssLearn/index.vue'),
                children: [
                    {
                        path: 'animation',
                        name: 'Animation',
                        component: () => import('../view/cssLearn/animation.vue'),
                    },
                    {
                        path: 'background',
                        name: 'Background',
                        component: () => import('../view/cssLearn/background.vue'),
                    },
                    {
                        path: 'gradients',
                        name: 'Gradients',
                        component: () => import('../view/cssLearn/gradients.vue')
                    },
                    {
                        path: 'multiColumn',
                        name: 'MultiColumn',
                        component: () => import('../view/cssLearn/multiColumn.vue')
                    }
                ]
            },
        ]
    },
    {
        path: '/bigScreen',
        name: 'BigSrceen',
        component: () => import('../view/bigScreen/index.vue')
    },
    {
        path: '/bigDigital',
        name: 'BigDigital',
        component: () => import('../view/bigScreen/digital.vue')
    },
    {
        path: '/theme',
        name: 'Theme',
        component: () => import('../view/theme/index.vue')
    },
    {
        path: '/login',
        name: 'login',
        component: () => import('../view/login/index.vue')
    },
    {
        path: '/card',
        name: 'Card',
        component: () => import('../view/test/index.vue')
    }
]

const router = createRouter({
    history: createWebHashHistory(),
    routes
})

router.beforeEach((to, from) => {
    let userNmae: String | null = localStorage.getItem('userName')
    if (to.meta.requiresAuth && userNmae == null) {
        return {
            path: '/login',
            query: {
                redirect: to.fullPath
            }
        }
    }
})

export default router;